/***

External links text
===================

Showing an arrow close to the text :

```
<div class="styleguide--demo">
    <a class="f--external" href="#" target="_blank">Permalink</a>
</div>
```

***/

.f--external {
  position:relative;
  text-decoration:none;

/*  .icon {
    color:inherit;
    position:absolute;
    bottom: 0.25em;
    vertical-align:baseline;
    transform: translateX(50%);
  }*/

  &:after {
    content: "\2197";
    font-size:12px;
    color:inherit;
    position:absolute;
    transform: translateX(50%);
    font-weight:400;
  }
}
